<template>
  <div>
    <div style="margin: 10px 0">
      <el-button type="warning" @click="doMultipleDel" :disabled="idsDialog.length == 0">
        批量删除
      </el-button>
      <el-popconfirm cancel-button-text="不用了" class="m-margin-l10" confirm-button-text="好的"
                     icon="el-icon-info"
                     icon-color="red" title="您确定清空吗？" @confirm="doConfirmClearAll">
        <el-button :disabled="errorList.length == 0" slot="reference" class="light_red_btn">清空
        </el-button>
      </el-popconfirm>
    </div>
    <el-table :data="errorList" border fit highlight-current-row
              @selection-change="handleSelectionChangeInDialog">
      <el-table-column type="selection" width="40"></el-table-column>
      <el-table-column align="center" label="姓名">
        <template slot-scope="scope">{{ scope.row.sName }}</template>
      </el-table-column>
      <el-table-column align="center" label="错误的列">
        <template slot-scope="scope">{{ scope.row.iColumn }}</template>
      </el-table-column>
      <el-table-column align="center" label="错误类型">
        <template slot-scope="scope">{{
            errorTypeObj[scope.row.iType]
          }}
        </template>
      </el-table-column>
      <el-table-column align="center" class-name="status-col" label="识别时间" prop="sCreateTime">
        <template slot-scope="scope">{{
            scope.row.sCreateTime
          }}
        </template>
      </el-table-column>
      <el-table-column align="center" class-name="status-col" label="操作" width="120">
        <template slot-scope="{ row, $index }">
          <el-button slot="reference" size="mini" class="light_red_btn" @click="deleteSingleError(row)">删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--分页-->
    <div style="margin-bottom: 30px">
      <pagination v-if="errorList.length !== 0" :limit.sync="dialogQuery1.limit" :page.sync="dialogQuery1.page"
                  :total="total" :page-sizes="[20, 100, 500, 1000]" @pagination="changeDialogPage1"/>
    </div>
  </div>
</template>

<script>
import {clearAllErrors, doDelError, doDelErrorMultiple, getErrorList} from "@/api/community/communityPerson";

export default {
  name: "errorRecord",
  data: function () {
    return {
      dialogQuery1: {
        limit: 20,
        page: 1,
      },
      total: 0,
      idsDialog: [],
      errorList: [],
      errorTypeObj: {
        0: "文件名重复",
        1: "名字重复",
        2: "文件找不到对应人员",
      },
    }
  },
  methods: {
    doMultipleDel() {
      let params = {id: this.idsDialog};
      doDelErrorMultiple(params).then((res) => {
        this.$message.success("删除成功");
        this.doGetErrorList();
        this.dialogFormGroup = false;
      });
    },
    // 错误列表
    doConfirmClearAll() {
      clearAllErrors().then((res) => {
        this.$message.success("清空成功");
        this.doGetErrorList();
        this.dialogFormGroup = false;
      });
    },
    deleteSingleError(row) {
      doDelError(row.id).then((res) => {
        this.$message.success("删除成功");
        this.doGetErrorList();
        this.dialogFormGroup = false;
      });
    },

    changeDialogPage1(val) {
      let [page, limit] = [val.page, val.limit];
      // this.listQuery.beginPosition = page * limit - limit;
      // this.listQuery.endPosition = page * limit - 1;
      // console.log(page, limit)
      getErrorList({
        beginTime: "",
        endTime: "",
        page: page,
        limit: limit,
        name: "",
      }).then((res) => {
        if (res) {
          this.errorList = res.matchList;
        }
      });
    },
    doGetErrorList() {
      getErrorList({
        beginTime: "",
        endTime: "",
        page: 1,
        limit: 20,
        name: "",
      }).then((res) => {
        console.log('res', res)
        if (res) {
          this.errorList = res.matchList;
          this.total = res.numOfMatches ? res.numOfMatches : 0
          this.$emit("getFaceCount")
        }
      });
    },
    handleSelectionChangeInDialog(e) {
      // console.log(e)
      this.idsDialog = [];
      if (e.length) {
        e.forEach((item, index) => {
          this.idsDialog.push(item.id);
        });
      }
      // console.log(this.idsDialog)
    },


  },
  mounted() {
    this.doGetErrorList()
  }
}
</script>

<style scoped>

</style>
